<template>
	<view class="my">
		<!-- 用户信息 -->
		<view class="login" @click="toJiBen">
			<view class="login-left">
				<view class="title">{{gaiNiName}}</view>
				<view>立即绑定&gt;</view>
			</view>
			<view class="login-right">
				<image :src="touImage" mode=""></image>
			</view>
		</view>
		<!-- 设置 -->
		<view class="set">
			<view class="set-item" @click="toZuiJin">
				<view>最近阅读</view>
				<view>&gt;</view>
			</view>
			<view class="set-item" @click="happy">
				<view>帮助中心</view>
				<view>&gt;</view>
			</view>
			<view class="set-item" @click="happy">
				<view>关于我们</view>
				<view>&gt;</view>
			</view>
			<view class="set-item" @click="toShezhi">
				<view>设置</view>
				<view>&gt;</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				touImage:"/static/static/role/role_14.png", //头像数据
				gaiNiName:"读书123688", //昵称
			}
		},
		// onLoad(){
		// 	//页面加载，接收子页面传递过来的值
		// 	uni.$on("touImage",(e)=>{ 
		// 			// console.log(e)
		// 			this.touImage = e
		// 	}),
		// 	uni.$on("gaiNiName",(e)=>{
		// 			// console.log(e)
		// 			this.gaiNiName = e
		// 	})
		// },
		onShow(){
			try { //获取头像
			    const value = uni.getStorageSync('touImage');
			    if (value) {
			        //console.log(value);
					this.touImage = value
			    }
			} catch (e) {
			    // error
			}
			try {  //获取昵称
			    const value = uni.getStorageSync('gaiName');
			    if (value) {
			        //console.log(value);
					this.gaiNiName = value
			    }
			} catch (e) {
			    // error
			}
		},
		methods: {
			toShezhi(){ //去设置
				//console.log(111)
				uni.navigateTo({
					url:'./shezi/shezi'
				})
			},
			toJiBen(){ //去基本信息
				uni.navigateTo({
					url:'./jiben/jiben'
				})
			},
			toZuiJin(){ //去最近阅读
				uni.navigateTo({
					url:'./zuijin/zuijin'
				})
			},
			happy(){  //帮助中心，关于我们
				uni.showToast({
					title:"亲，此功能暂未开通~",
					duration:2000,
					icon:"none"
				})
			}
		}
	}
</script>

<style scoped  lang="scss">
.my{
	.login{
		display: flex;
		justify-content: space-between;
		padding: 157rpx 36rpx 80rpx;
		.login-left{
			font-size: 30rpx;
			font-family: Microsoft YaHei;
			font-weight: 400;
			color: #BEBEBE;
			line-height: 60rpx;
			.title{
				font-size: 46rpx;
				font-family: Microsoft YaHei;
				font-weight: bold;
				color: #000000;
			}
		}
		.login-right{
			image{
				width: 130rpx;
				height: 130rpx;
				border: 1px solid #fff;
				border-radius: 50%;
			}
		}
	}
	.set{
		.set-item{
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin: 0 auto;
			width: 680rpx;
			height: 100rpx;
			border-bottom: 1px solid #F4F4F4;
			view{
				font-size: 30rpx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #000000;
			}
		}
	}
}
</style>
